<template>
	<uni-nav-bar title="盘库" left-icon="left" @clickLeft="navBack" :fixed="true" statusBar></uni-nav-bar>
	<view class="package_sale">您的盘库数据已提交 {{text?'请继续操作完成'+text:''}} </view>
	<view class="package_sale" v-if="getAmountPanAll">
		<view class="space-between" v-if="state==1">
			<view>服务站</view>
			<view>{{getAmountPanAll.service_name}}</view>
		</view>
		<view class="space-between" v-else>
			<view>加注机</view>
			<view>{{getAmountPanAll.fill_name}}</view>
		</view>
		<view class="space-between top">
			<view>溶液存量</view>
			<view>{{getAmountPanAll.amount}}</view>
		</view>
		<view class="space-between top">
			<view>时间</view>
			<view>{{getAmountPanAll.createtime}}</view>
		</view>
		<view class="top">
			<view>图片</view>
			<view class="center list">
				<image v-for="(item,index) in getAmountPanAll.image" :src="item.image" :key="index"
					@tap="onPreviewImage(index)" mode="aspectFill"></image>
			</view>
		</view>
	</view>
	<view class="add" @click="submit()">{{text?text:'确定'}}</view>
</template>

<script setup lang="ts">
	import { navBack, redirectTo } from '@/utils/navigator';
	import { ref } from 'vue';
	import { onLoad } from '@dcloudio/uni-app';
	import { errorToast, showLoading, successToast } from '@/utils/prompt';
	import { getAmountPan } from '@/gql/earthPushing/warehouse';
	import { toPublish } from '@mqtt';
	import { scanQRCode } from '@/utils/wechat.jssdk';
	const text = ref('')
	const type = ref()
	const state = ref('')
	const id = ref()
	const imgList = ref([])
	const getAmountPanAll = ref()
	onLoad((pearm) => {
		id.value = Number(pearm.id)
		if (pearm.type) {
			type.value = pearm.type
			text.value = pearm.type == 1 ? '补液' : pearm.type === 'addRelocation' ? '移库' : pearm.type === 'addOutbound' ? '采购入库' : pearm.type === 'addAccount' ? '调整溶液存量' : pearm.type === 'addService' ? '服务站调整溶液' : ''
		}
		state.value = pearm.state
		init()
	})
	function init() {
		showLoading()
		const payload = {
			query: getAmountPan,
			variables: {
				id: id.value,
			},
		};
		toPublish(
			'ql/staff/getAmountPan',
			payload,
			(obj : any) => {
				const { getAmountPan } = obj.data;
				getAmountPanAll.value = getAmountPan
				getAmountPanAll.value.image.map((item) => {
					imgList.value.push(item.image)
				})
			}
		);
	}
	//预览图片
	function onPreviewImage(index : number) {
		const isReverse = false;
		const currentIndex = isReverse ? (imgList.value.length - index) - 1 : index
		const imgLists = isReverse ? imgList.value.reverse() : imgList.value;
		uni.previewImage({
			current: currentIndex,
			urls: imgLists
		});
	}
	function submit() {
		if (type.value == 1) {
			sqres()
		} else if (type.value === 'addRelocation') {
			redirectTo('administrator/document/relocation/addRelocation')
		} else if (type.value === 'addOutbound') {
			redirectTo('administrator/document/outbound/addOutbound')
		} else if (type.value === 'addAccount') {
			redirectTo('administrator/document/filling/addAccount')
		} else if (type.value === 'addService') {
			redirectTo('administrator/document/service/addService')
		} else {
			navBack()
		}
	}
	function sqres() {
		scanQRCode((res : any) => {
			const orderIDs = res.resultStr.split('fill_id=')[1];
			if (orderIDs) {
				uni.setStorageSync('fillingID', orderIDs);
				redirectTo('rehydrator/filling/fluid')
			} else {
				alert('请扫描正确的二维码');
			}
		});
	}
</script>

<style scoped lang="less">
	.top {
		margin-top: 25rpx;
	}

	.add {
		width: 480rpx;
		height: 100rpx;
		background: linear-gradient(-10deg, #2C96F9, #1B91FF);
		border-radius: 5px;
		text-align: center;
		line-height: 100rpx;
		color: #fff;
		margin: 60rpx auto 20rpx;
		font-size: 32rpx;
	}

	.list {
		flex-wrap: wrap;

		image {
			width: 30%;
			margin: 20rpx 0px 0px 3%;
			height: var(--mk-upload_img_height, 100px);
		}
	}
</style>